<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="/static/css/index_style.css"/>
		<link rel="stylesheet" type="text/css" href="/static/css/main_style.css"/>
        <link rel="icon" href="/static/images/favicon.ico">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
                <script type="text/javascript" src="/static/js/jquery.min.js"></script>
        <link rel="stylesheet" type="text/css" href="/static/tankuang/css/guide-septAct.css">
        <style>

            .box3{
            /* 自动换行 */
            word-wrap: break-word;
            word-break: normal;
            height: 200px;
            width: 100px;
            border: 1px solid white;
            margin-bottom: 10px;
        }
        </style>
        <style type="text/css">

  .tab_css {
    color: #31c27c;
    display: none;
    {#float: left;#}
  }
</style>
        <script type="text/javascript">
      var myclick = function(v) {
        var llis = document.getElementsByTagName("a");
        for(var i = 0; i < llis.length; i++) {
          var lli = llis[i];
          if(lli == document.getElementById("tab" + v)) {
            lli.style.color = "#61bd7c";
          } else {
            lli.style.color = "black";
          }
        }
        var divs = document.getElementsByClassName("tab_css");
        for(var i = 0; i < divs.length; i++) {
          var divv = divs[i];
          if(divv == document.getElementById("tab" + v + "_content")) {
            divv.style.display = "block";
          } else {
            divv.style.display = "none";
          }
        }
      }
    </script>
        <script type="text/javascript" src="/static/seacher/js/js.js"></script>
        <link rel="stylesheet" type="text/css" href="/static/css/shanghuan.css">

	</head>

	<iframe src="{{ url('index:index') }}" width="100%" height="142px" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes" style="display: block;"></iframe>
	<body id="main">
        <div class="guide-all">
	<div class="all-bg">
		<div class="all-layout">
			<a href="/albums_detail/?id=86670457"></a>
			<span class="guide-all-close"></span>
		</div>
	</div>
</div>
		<div class="song list_song song_control">
			<div class="song_left"><a href="JavaScript:;" onclick="ListChange(this)"><</a></div>
			<div class="song_right"><a href="JavaScript:;" onclick="ListChange(this)">></a></div>
			<div class="list_song_box list_control" style="margin:0 auto">
				<h2 class="font"></h2>
				<ul class="list_song_title title">
					<li><a href="JavaScript:;" id="tab1" onclick="myclick(1)" style="color: #61bd7c">为你推荐</a></li>
					<li><a href="JavaScript:;" id="tab2" onclick="myclick(2)">流行音乐</a></li>
					<li><a href="JavaScript:;" id="tab3" onclick="myclick(3)">学习工作</a></li>
					<li><a href="JavaScript:;" id="tab4" onclick="myclick(4)">网络歌曲</a></li>
					<li><a href="JavaScript:;" id="tab5" onclick="myclick(5)">官方歌单</a></li>
					<li><a href="JavaScript:;" id="tab6" onclick="myclick(6)">情歌</a></li>
				</ul>
				<div class="list_song_gun list_control">
					<div class="banner tab_css" id="tab1_content" style="display: block">
					<ul>
                        {% for all in songlist_recommend %}
						<li>
							<div>
							<a href="/song_list/?id={{ all.song_list_id }}" class="list_song_gun_i img_fd">
								<img src="{{ all.song_list_pic }}" alt="tp" class="img_move" />
								<i class="list_song_gun_play"></i>
							</a>
							<h4><a href="/song_list/?id={{ all.song_list_id }}" class="box3">{{ all.song_list_name }}</a></h4>
							<p class="color_gray">播放量：{{ all.song_list_play_num }}</p>
							</div>
						</li>
                        {% endfor %}
					</ul>
					</div>
                    <div class="banner tab_css" id="tab2_content">
					<ul>
                        {% for all in songlist_fashion %}
						<li>
							<div>
							<a href="/song_list/?id={{ all.song_list_id }}" class="list_song_gun_i img_fd">
								<img src="{{ all.song_list_pic }}" alt="tp" class="img_move" />
								<i class="list_song_gun_play"></i>
							</a>
							<h4><a href="/song_list/?id={{ all.song_list_id }}" class="box3">{{ all.song_list_name }}</a></h4>
							<p class="color_gray">播放量：{{ all.song_list_play_num }}</p>
							</div>
						</li>
                        {% endfor %}
					</ul>
					</div>
                    <div class="banner tab_css" id="tab3_content">
					<ul>
                        {% for all in songlist_student %}
						<li>
							<div>
							<a href="/song_list/?id={{ all.song_list_id }}" class="list_song_gun_i img_fd">
								<img src="{{ all.song_list_pic }}" alt="tp" class="img_move" />
								<i class="list_song_gun_play"></i>
							</a>
							<h4><a href="/song_list/?id={{ all.song_list_id }}" class="box3">{{ all.song_list_name }}</a></h4>
							<p class="color_gray">播放量：{{ all.song_list_play_num }}</p>
							</div>
						</li>
                        {% endfor %}
					</ul>
					</div>
                    <div class="banner tab_css" id="tab4_content">
                        <ul>
                            {% for all in songlist_net %}
                            <li>
                                <div>
                                <a href="/song_list/?id={{ all.song_list_id }}" class="list_song_gun_i img_fd">
                                    <img src="{{ all.song_list_pic }}" alt="tp" class="img_move" />
                                    <i class="list_song_gun_play"></i>
                                </a>
                                <h4><a href="/song_list/?id={{ all.song_list_id }}" class="box3">{{ all.song_list_name }}</a></h4>
                                <p class="color_gray">播放量：{{ all.song_list_play_num }}</p>
                                </div>
                            </li>
                            {% endfor %}
                        </ul>
                        </div>
                    <div class="banner tab_css" id="tab5_content">
                        <ul>
                            {% for all in songlist_official %}
                            <li>
                                <div>
                                <a href="/song_list/?id={{ all.song_list_id }}" class="list_song_gun_i img_fd">
                                    <img src="{{ all.song_list_pic }}" alt="tp" class="img_move" />
                                    <i class="list_song_gun_play"></i>
                                </a>
                                <h4><a href="/song_list/?id={{ all.song_list_id }}" class="box3">{{ all.song_list_name }}</a></h4>
                                <p class="color_gray">播放量：{{ all.song_list_play_num }}</p>
                                </div>
                            </li>
                            {% endfor %}
                        </ul>
                        </div>
                    <div class="banner tab_css" id="tab6_content">
					<ul>
                        {% for all in songlist_romance %}
						<li>
							<div>
							<a href="/song_list/?id={{ all.song_list_id }}" class="list_song_gun_i img_fd">
								<img src="{{ all.song_list_pic }}" alt="tp" class="img_move" />
								<i class="list_song_gun_play"></i>
							</a>
							<h4><a href="/song_list/?id={{ all.song_list_id }}" class="box3">{{ all.song_list_name }}</a></h4>
							<p class="color_gray">播放量：{{ all.song_list_play_num }}</p>
							</div>
						</li>
                        {% endfor %}
					</ul>
					</div>
				</div>

			</div>
			<div class="song_page">
				<a href="JavaScript:;" class="actives" onclick="ListChange(this)"></a>
				<a href="JavaScript:;" onclick="ListChange(this)"></a>
				<a href="JavaScript:;" onclick="ListChange(this)"></a>
			</div>
		</div>
		<div class="song song_control new_song">
			<div class="song_left"><a href="JavaScript:;" onclick="ListChange(this)"><</a></div>
			<div class="song_right"><a href="JavaScript:;" onclick="ListChange(this)">></a></div>
			<div class="new_song_box list_control" style="margin:0 auto">
					<h2 class="font"></h2>
					<a href="JavaScript:;" class="play_all"><span class="glyphicon glyphicon-play "></span>播放全部</a>
					<ul class="list_song_title title">
						<li><a href="JavaScript:;" class="actives">内地</a></li>
						<li><a href="JavaScript:;">港台</a></li>
						<li><a href="JavaScript:;">欧美</a></li>
						<li><a href="JavaScript:;">日本</a></li>
						<li><a href="JavaScript:;">韩国</a></li>

					</ul>
					<div class="new_song_list list_control song_gun">
						<div class="banner">
						<ul>
                            {% for a in new_song_list[0:9] %}
							<li>
								<a href="/player/?id={{ a.song_id }}" target="_blank" class="img_fd list_song_gun_i"><img src="{{ a.song_pic }}" alt="tp" class="img_move" /><i class="list_song_gun_play"></i></a>
								<h4><a href="/song_details/?id={{ a.song_id }}" class="x_title">{{ a.song_name }}</a></h4>
								<p class="color_gray"><a href="/singers_detail/?id={{ a.singer_id }}">{{ a.singer_name }}</a></p>
								<p class="color_gray">{{ a.time }}</p>
							</li>
						    {% endfor %}

						</ul>
						<ul>
                            {% for a in new_song_list[10:19] %}
							<li>
								<a href="/player/?id={{ a.song_id }}" target="_blank" class="img_fd list_song_gun_i"><img src="{{ a.song_pic }}" alt="tp" class="img_move" /><i class="list_song_gun_play"></i></a>
								<h4><a href="/song_details/?id={{ a.song_id }}" class="x_title">{{ a.song_name }}</a></h4>
								<p class="color_gray"><a href="/singers_detail/?id={{ a.singer_id }}">{{ a.singer_name }}</a></p>
								<p class="color_gray">{{ a.time }}</p>
							</li>
						    {% endfor %}
						</ul>
						<ul>
							{% for a in new_song_list[20:30] %}
							<li>
								<a href="/player/?id={{ a.song_id }}" target="_blank" class="img_fd list_song_gun_i"><img src="{{ a.song_pic }}" alt="tp" class="img_move" /><i class="list_song_gun_play"></i></a>
								<h4><a href="/song_details/?id={{ a.song_id }}" class="x_title">{{ a.song_name }}</a></h4>
								<p class="color_gray"><a href="/singers_detail/?id={{ a.singer_id }}">{{ a.singer_name }}</a></p>
								<p class="color_gray">{{ a.time }}</p>
							</li>
						    {% endfor %}
						</ul>
						</div>

					</div>
			</div>
					<div class="song_page">
						<a href="JavaScript:;" class="actives" onclick="ListChange(this)"></a>
						<a href="JavaScript:;" onclick="ListChange(this)"></a>
						<a href="JavaScript:;" onclick="ListChange(this)"></a>
					</div>
		</div>
		<div class="song song_control commend">
			<div class="song_left"><a href="JavaScript:;" onclick="ListChange(this)"><</a></div>
			<div class="song_right"><a href="JavaScript:;" onclick="ListChange(this)">></a></div>
			<div class="commend_box list_control" style="margin:0 auto">
					<h2 class="font"></h2>
					<div class="commend_list list_control">
						<div>
							<ul class="banner">
								<li><a href="JavaScript:;"><img src="/static/images/图1.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/图2.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/597781.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/598692.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/601361.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/604933.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/608107.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/610935.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/608853.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
								<li><a href="JavaScript:;"><img src="/static/images/610935.jpg" alt="tp" style="width:580px; height:232px"/></a></li>
							</ul>
						</div>
					</div>
			</div>
					<div class="song_page">
						<a href="JavaScript:;" class="actives" onclick="ListChange(this)"></a>
						<a href="JavaScript:;" onclick="ListChange(this)"></a>
						<a href="JavaScript:;" onclick="ListChange(this)"></a>
						<a href="JavaScript:;" onclick="ListChange(this)"></a>
						<a href="JavaScript:;" onclick="ListChange(this)"></a>
					</div>
		</div>

		<div class="song song_control ranking_list">
			<div class="ranking_list_box list_control " style="margin:0 auto">
					<h2 class="font"></h2>
					<a href="/Surge_Top" class="more">更多></a>
					<div class="top_list list_control">
						<ul>
							<li>
								<div class="top_list_one top_list_div">
									<div class="top_list_bg"></div>
									<h3><a href="JavaScript:;">飙升指数</a></h3>
									<i class="line"></i>
									<a href="JavaScript:;"><i class="list_song_gun_play"></i></a>
									<ul>
                                        {% for x in surge_top_list %}
										<li>
											<div>{{ x.num }}</div>
											<div><a href="/song_details/?id={{ x.surge_song_id }}">{{ x.surge_song_name }}</a></div>
											<div><a href="/singers_detail/?id={{ x.surge_singer_id }}">{{ x.surge_singer_name }}</a></div>
										</li>
                                        {% endfor %}
									</ul>
								</div>
							</li>
							<li>
								<div  class="top_list_two top_list_div">
									<div class="top_list_bg"></div>
									<h3><a href="JavaScript:;">热歌</a></h3>
									<i class="line"></i>
									<i class="list_song_gun_play"></i>
									<ul>
										{% for x in hot_top_list %}
										<li>
											<div>{{ x.num }}</div>
											<div><a href="/song_details/?id={{ x.surge_song_id }}">{{ x.surge_song_name }}</a></div>
											<div><a href="/singers_detail/?id={{ x.surge_singer_id }}">{{ x.surge_singer_name }}</a></div>
										</li>
                                        {% endfor %}

									</ul>
								</div>
							</li>
							<li>
								<div class="top_list_three top_list_div">
									<div class="top_list_bg"></div>
									<h3><a href="JavaScript:;">新歌</a></h3>
									<i class="line"></i>
									<i class="list_song_gun_play"></i>
									<ul>
										{% for x in new_top_list %}
										<li>
											<div>{{ x.num }}</div>
											<div><a href="/song_details/?id={{ x.surge_song_id }}">{{ x.surge_song_name }}</a></div>
											<div><a href="/singers_detail/?id={{ x.surge_singer_id }}">{{ x.surge_singer_name }}</a></div>
										</li>
                                        {% endfor %}
									</ul>
								</div>
							</li>
							<li>
								<div class="top_list_four top_list_div">
									<div class="top_list_bg"></div>
									<h3><a href="JavaScript:;">欧美</a></h3>
									<i class="line"></i>
									<i class="list_song_gun_play"></i>
									<ul>
										{% for x in EUROPE_top_list %}
										<li>
											<div>{{ x.num }}</div>
											<div><a href="/song_details/?id={{ x.surge_song_id }}">{{ x.surge_song_name }}</a></div>
											<div><a href="/singers_detail/?id={{ x.surge_singer_id }}">{{ x.surge_singer_name }}</a></div>
										</li>
                                        {% endfor %}
									</ul>
								</div>
							</li>
							<li>
								<div class="top_list_five top_list_div">
									<div class="top_list_bg"></div>
									<h3><a href="JavaScript:;">韩国</a></h3>
									<i class="line"></i>
									<i class="list_song_gun_play"></i>
									<ul>
										{% for x in Korea_top_list %}
										<li>
											<div>{{ x.num }}</div>
											<div><a href="/song_details/?id={{ x.surge_song_id }}">{{ x.surge_song_name }}</a></div>
											<div><a href="/singers_detail/?id={{ x.surge_singer_id }}">{{ x.surge_singer_name }}</a></div>
										</li>
                                        {% endfor %}
									</ul>
								</div>
							</li>
						</ul>
					</div>
			</div>
		</div>
		<div class="song song_control song_mv ">
            <div class="song_left"><a href="JavaScript:;" onclick="ListChange(this)"><</a></div>
			<div class="song_right"><a href="JavaScript:;" onclick="ListChange(this)">></a></div>
			<div class="song_mv_box list_control" style="margin:0 auto">
				<h2 class="font"></h2>
				<ul class="song_mv_title title">
					<li><a href="JavaScript:;" style="color: #61bd7c; display: block">精选</a></li>
					<li><a href="JavaScript:;" >内地</a></li>
					<li><a href="JavaScript:;">港台</a></li>
					<li><a href="JavaScript:;" >欧美</a></li>
					<li><a href="JavaScript:;" >日本</a></li>
					<li><a href="JavaScript:;">韩国</a></li>
				</ul>
				<div class="song_mv_gun list_control tab_css"  style="display: block">
					<div>
						<ul>
                            {% for x in Mv_choiceness[0:10] %}
							<li>
								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">
									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>
									<i class="list_song_gun_play"></i>
								</a>
								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>
								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>
								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>
							</li>
                            {% endfor %}
						</ul>
						<ul>
			                {% for x in Mv_choiceness[10:20] %}
							<li>
								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">
									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>
									<i class="list_song_gun_play"></i>
								</a>
								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>
								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>
								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>
							</li>
                            {% endfor %}
						</ul>
						<ul>
						{% for x in Mv_choiceness[20:30] %}
							<li>
								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">
									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>
									<i class="list_song_gun_play"></i>
								</a>
								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>
								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>
								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>
							</li>
                            {% endfor %}

						</ul>
					</div>
				</div>
                <div class="song_mv_gun list_control tab_css" >
                <div>
						<ul>
                            {% for x in Mv_hinterland[0:10] %}
							<li>
								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">
									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>
									<i class="list_song_gun_play"></i>
								</a>
								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>
								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>
								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>
							</li>
                            {% endfor %}
						</ul>
						<ul>
			                {% for x in Mv_hinterland[10:20] %}
							<li>
								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">
									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>
									<i class="list_song_gun_play"></i>
								</a>
								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>
								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>
								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>
							</li>
                            {% endfor %}
						</ul>
						<ul>
						{% for x in Mv_hinterland[20:30] %}
							<li>
								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">
									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>
									<i class="list_song_gun_play"></i>
								</a>
								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>
								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>
								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>
							</li>
                            {% endfor %}

						</ul>
					</div>
            </div>
{#                <div class="song_mv_gun list_control tab_css" id="tab9_content">#}
{#                    <div>#}
{#						<ul>#}
{#                            {% for x in Mv_Europe[0:10] %}#}
{#							<li>#}
{#								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">#}
{#									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>#}
{#									<i class="list_song_gun_play"></i>#}
{#								</a>#}
{#								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>#}
{#								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>#}
{#								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>#}
{#							</li>#}
{#                            {% endfor %}#}
{#						</ul>#}
{#						<ul>#}
{#			                {% for x in Mv_Europe[10:20] %}#}
{#							<li>#}
{#								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">#}
{#									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>#}
{#									<i class="list_song_gun_play"></i>#}
{#								</a>#}
{#								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>#}
{#								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>#}
{#								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>#}
{#							</li>#}
{#                            {% endfor %}#}
{#						</ul>#}
{#						<ul>#}
{#						{% for x in Mv_Europe[20:30] %}#}
{#							<li>#}
{#								<a href="/mv_detail/?mv_id={{ x.mv_id }}" class="list_song_gun_i img_fd">#}
{#									<img src="{{ x.mv_pic }}" alt="图片" style="width: 220px; height: 120px" class="img_move"/>#}
{#									<i class="list_song_gun_play"></i>#}
{#								</a>#}
{#								<h4><a href="/mv_detail/?mv_id={{ x.mv_id }}">{{ x.mv_name }}</a></h4>#}
{#								<a href=/singers_detail/?id={{ x.mv_singer_id }} class="color_gray">{{ x.mv_singer }}</a>#}
{#								<p class="color_gray"><span class="glyphicon glyphicon-expand"></span>{{ x.mv_play_num }}</p>#}
{#							</li>#}
{#                            {% endfor %}#}
{##}
{#						</ul>#}
{#					</div>#}
{#             </div>#}

			</div>
			<div class="song_page">
				<a href="JavaScript:;" class="actives" onclick="ListChange(this)"></a>
				<a href="JavaScript:;" onclick="ListChange(this)"></a>
				<a href="JavaScript:;" onclick="ListChange(this)"></a>
			</div>
		</div>

	<!-- 右侧固定 -->
	<div class="gun_right">
		<div class="gun_right_t" id="gr">
			<i class="gun_right_t_i"></i>
		</div>
		<div class="gun_right_c">反馈</div>
		<div class="gun_right_b">
			<i class="gun_right_i"></i>
		</div>
	</div>

		<iframe src="{{ url('index:footer') }}" width="100%" height="600px" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes" style="display: block;"></iframe>

    </body>
	<script src="/static/js/jquery.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
				var list_index=0;

				function ListChange(obj){
					var a=$(obj).parent().parent();
					var b=$(obj).parent();
					b.index=a.children(".song_page").children(".actives").index();
					var list_length = a.children(".song_page").children().length;
						b.off("click").on("click",function(){
							if (b.attr("class")=="song_left") {
								b.index=b.index-1;
								if (b.index==-1) {
									a.children(".list_control").children(".list_control").children().css({"transition":"0s","left":list_length*(-100)+"%"});
									b.index=list_length-1;
								}
								list_index=b.index;
							} else{
								b.index=b.index+1;
								if (b.index==list_length) {
									a.children(".list_control").children(".list_control").children().css({"transition":"0s","left":"100%"});
									b.index=0;
								}
								list_index=b.index;
							}

								a.children(".list_control").children(".list_control").children().stop(true).animate({left:list_index*(-100)+"%"},function(){
										a.children(".song_page").children().removeClass("actives");
										a.children(".song_page").children().eq(list_index).addClass("actives");

								});
						})
						a.children(".song_page").children("a").on("click",function(){
							list_index=a.children(".song_page").children().index(this);
							a.children(".list_control").children(".list_control").children().stop(true).animate({left:list_index*(-100)+"%"},function(){
									a.children(".song_page").children().removeClass("actives");
									a.children(".song_page").children().eq(list_index).addClass("actives");
								});
							a.children(".song_page").off("click");
						})

				}

				$(function(){
					var Len =document.querySelectorAll(".list_song_gun li");
					var aLi = new Array();
					for(var item of Len){
						aLi.push(item.innerHTML);
					}
					$(".list_song_gun ul").append("<li></li><li></li><li></li><li></li><li></li>");
					var Len =document.querySelectorAll(".list_song_gun li");
					var j=4;
					for (var i=Len.length;i>(Len.length-5);i--) {
						$(".list_song_gun ul li:eq("+(i-1)+")").append(aLi[j]);
						j--;
					{#alert("1");#}
					}
					var len=$(".list_song_gun ul li").length-1;
					$(".list_song_gun ul").prepend($(".list_song_gun ul li:eq("+len+")").clone());
					$(".list_song_gun ul").prepend($(".list_song_gun ul li:eq("+len+")").clone());
					$(".list_song_gun ul").prepend($(".list_song_gun ul li:eq("+len+")").clone());
					$(".list_song_gun ul").prepend($(".list_song_gun ul li:eq("+len+")").clone());
					$(".list_song_gun ul").prepend($(".list_song_gun ul li:eq("+len+")").clone());
					$(".list_song_gun ul").append($(".list_song_gun ul li:eq(5)").clone());
					$(".list_song_gun ul").append($(".list_song_gun ul li:eq(6)").clone());
					$(".list_song_gun ul").append($(".list_song_gun ul li:eq(7)").clone());
					$(".list_song_gun ul").append($(".list_song_gun ul li:eq(8)").clone());
					$(".list_song_gun ul").append($(".list_song_gun ul li:eq(9)").clone());

					$(".new_song_list div").append($(".new_song_list ul:eq(1)").clone());

					len=$(".commend_list ul li").length-1;
					$(".commend_list ul").prepend($(".commend_list ul li:eq("+len+")").clone());
					$(".commend_list ul").prepend($(".commend_list ul li:eq("+len+")").clone());
					$(".commend_list ul").append($(".commend_list ul li:eq(2)").clone());
					$(".commend_list ul").append($(".commend_list ul li:eq(3)").clone());

					len=$(".new_dish_gun ul").length-1;
					$(".new_dish_gun div").prepend($(".new_dish_gun ul:eq("+len+")").clone());
					$(".new_dish_gun div").append($(".new_dish_gun ul:eq(2)").clone());

					len=$(".song_mv_gun ul").length-1;
					$(".song_mv_gun div").prepend($(".song_mv_gun ul:eq("+len+")").clone());
					$(".song_mv_gun div").append($(".song_mv_gun ul:eq(2)").clone());

				})


	</script>
    <script type="text/javascript" src="/static/tankuang/js/guidetool.js"></script>



</html>